﻿<%@ Page Title="" Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" ValidateRequest="false" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Bokning av konferensrum</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen" />
    <link href="css/custom.css" rel="stylesheet" media="screen" />
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/modalCust.js"></script>
    <!--Reference the SignalR library. -->
    <script src="Scripts/jquery.signalR-2.0.3.min.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src="signalr/hubs"></script>
    <link rel="shortcut icon" type="image/x-icon" href="css/favicon.ico" />
</head>
<body>
    <div class="container">
        <div id="alert" class="alert alert-<%=alertMessageData.alertMessageColor %>">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
            <p><%=alertMessageData.Message %></p>
        </div>
        
        <ul id="roomNav" class="pagination pagination-lg" runat="server">
            <li class="disabled"><a>Konferensrum #</a></li>
        </ul>

        <h3 id="dayName"><%=currentDate.ToString("d MMMM yyy") %></h3>

        <div class="jumbotron">
            <form id="updateForm" role="form" method="post" enctype="multipart/form-data" runat="server">
                <asp:ScriptManager ID="scriptManager" runat="server"></asp:ScriptManager>
                <asp:UpdatePanel id="daySchedulePanel" runat="server" OnLoad="daySchedulePanel_Load">
                    <ContentTemplate>
                        <div class="list-group" id="daySchedule">
                            <div id="bookings" runat="server"></div>
                            <asp:Repeater ID="scheduleRepeater" runat="server">
                                <ItemTemplate>
                                    <a href="#" class="list-group-item" data-toggle="modal" data-target="#basicModal" id='<%#(Container.DataItem)%>'><%#(Container.DataItem)%>:00</a>
                                </ItemTemplate>
                            </asp:Repeater>
                        </div>
                        <asp:Button ID="updateBookingsButton" runat="server" Visible="False" />
                    </ContentTemplate>
                </asp:UpdatePanel>
        
                <asp:UpdatePanel ID="calendarUpdatePanel" runat="server" OnLoad="calendarUpdatePanel_Load">
                    <ContentTemplate>
                        <div id="calendar">
                            <div id="monthTitle">
                                <a id="todayLink" runat="server"><p class="glyphicon glyphicon-refresh"></p>Gå till dagens datum</a>
                                <a id="prevMonth" runat="server" class="glyphicon glyphicon-arrow-left"></a>
                                <span id="monthName"><%=utilities.FirstUpper(currentDate.ToString("MMMM yyyy")) %></span>
                                <a id="nextMonth" runat="server" class="glyphicon glyphicon-arrow-right"></a>
                                <a id="registerLink" href="Register.aspx">Registrera<p class="glyphicon glyphicon-plus"></p></a>
                            </div>
            
                            <div id="dayTitle">
                                <div class="calWeekNumber">Vecka</div>
                                <span>Må</span>
                                <span>Ti</span>
                                <span>On</span>
                                <span>To</span>
                                <span>Fr</span>
                                <span>Lö</span>
                                <span>Sö</span>
                                <div class="clear"></div>
                            </div>
                
                            <div id="calWeeks" runat="server"></div>
                            <div class="clear"></div>
                        </div>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </form>
            <div class="clear"></div>
        </div>
    </div>
    <div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true" style="display: none;">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title" id="bookingTitle">title</h4>
                </div>
                <form role="form" method="post" enctype="multipart/form-data">
                    <input type="hidden" id="hiddenBooking" runat="server" value="1" />
                    <div class="modal-body">
                        <div class="form-group">
                            <label for="inputFrom">Boka tid från:</label>
                            <div class="comboBox">
                                <select id="ddFrom" name="ddFrom" runat="server" class="form-control" data-name="tBoxFrom"></select>
                                <input type="text" name="tBoxFrom" id="tBoxFrom" runat="server" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="inputFrom">Boka tid till:</label>
                            <div class="comboBox">
                                <select id="ddTo" name="ddTo" runat="server" class="form-control" data-name="tBoxTo"></select>
                                <input type="text" name="tBoxTo" id="tBoxTo" runat="server" />
                            </div>
                        </div>
                        <div class="form-group">  
                            <label for="ddName">Välj namn:</label>
                            <select id="ddName" runat="server" data-name="tBoxName" class="form-control"></select>
                            <a href="Register.aspx">Registrera ny användare</a>
                        </div>
                        <div class="form-group">
                            <label for="inputMessage">Meddelande:</label>
                            <textarea id="inputMessage" runat="server" class="form-control" rows="3"></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Stäng</button>
                        <button type="submit" id="submitBooking" name="submitBooking" class="btn btn-primary" formmethod="post">Boka tid</button>     
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(function () {
            // Declare a proxy to reference the hub. 
            var updateHub = $.connection.bookingHub;

            // Create a function that the hub can call to broadcast messages.
            updateHub.client.broadcastChanges = function (postedDate, roomId) {
                var postedDate = new Date(Date.parse(postedDate)).toDateString();
                var currentDate = new Date(Date.parse("<%=currentDate.ToShortDateString() %>")).toDateString();

                if (postedDate == currentDate && roomId == "<%=roomId %>"){
                    window.location.reload(true);
                }
            };

            $.connection.hub.start().done();
        });
    </script>
</body>
</html>